//渲染everything
layui.use(['table', 'layer', 'element', 'form'], function() {
	var table = layui.table,
		element = layui.element,
		layer = layui.layer,
		form = layui.form;
	//初始化界面完成
	getautio5();
	
	//JQ初始化座位
	loadSeat();
	//仅仅渲染temp座位
	loadonlyTemp();
	//为from渲染
	form.render();
	//为#table_user渲染
	table.render({
		id: 'table_user',
		elem: '#table_user',
		url: url_alluser, //后台所有用户异步数据接口
		height: '430px',
		title: '用户表',
		page: false, //开启分页
		totalRow: false, //开启合计行
		cols: [
			[ //表头
				{
					type: 'checkbox',
					fixed: 'left'
				}, {
					field: 'uid',
					title: 'ID',
					width: 60,
					fixed: 'left',
				}, {
					field: 'name',
					title: '姓名',
					width: 80
				}, {
					field: 'sex',
					title: '性别',
					width: 60,
				}, {
					field: 'age',
					title: '年龄',
					width: 60,
				}, {
					field: 'idcard',
					title: '身份证号',
					width: 180
				}, {
					field: 'phone',
					title: '手机号',
					width: 150
				}, {
					field: 'type',
					title: '乘客类型',
					width: 90,
				}, {
					field: 'prefer',
					title: '乘客偏好',
					width: 180
				}, {
					field: 'cond',
					title: '状态',
					width: 60,
					hide: true
				}
			]
		]
	});
	//单多人分配提交按钮
	$("#btn_getRow").click(function() {
		
		/*$('embed').remove();
		$('body').append("<embed src='music/tts_test.wav' autostart='true' hidden='true' loop='false'>");*/
		
		
		var checkStatus = table.checkStatus('table_user');
		//筛选条件阶段
		if (checkStatus.data.length > 8 || checkStatus.data.length <= 0) {
			getautio3(); //播放音效
			layer.msg('一次团购人数必须大于0小于9个', {
				icon: 2,
				anim: 6
			});
			
			return;
		}
		//开始提交操作
		var load_index = layer.load(2); //loading动画
		var baowen = JSON.stringify(checkStatus.data);
		//将报文提交给后台并获得计算数据
		$.ajax({
			url: url_tempandpivot,
			type: 'post',
			data: {
				'users': baowen
			},
			async: true,
			success: function(r) {
				layer.close(load_index);
				//loadArithmetic(88, 190, checkStatus.data.length, 200, 56, 89, 99); //加载数据透视(测试)
				loadArithmetic(r.sfhs, r.ddcs, checkStatus.data.length, r.jczrs, r.bcfpmyd, r.jczmyd, r.zhcj); //加载数据透视
				loadPlane(r.tempData); //分配之后加载航班模型(座位上色)
				stroke(r.tempData);
				getautio1(); //播放音效
				//重载#table_users
				table.reload('table_user', {
					url: url_alluser
				});
			},
			error: function(r) {
				layer.close(load_index);
				console.log(r);
				layer.msg('服务器繁忙');
			}
		})
	});
	//整舱分配按钮
	$('#btn_fullHouse').click(function() {
		var confirm_index = layer.confirm('将为机舱内乘客重新安排座位',{title:'询问',icon:6},function(){
			layer.close(confirm_index);
			var load_index = layer.load(2);
			$.ajax({
				url : url_fullallocate,
				async:true,
				success:function(r){
					layer.close(load_index);				
					//清空刚刚的虚线
					$('[id^="seat"]').parent().removeClass('border');
					//座位上色
					//loadArithmetic(88, 190, checkStatus.data.length, 200, 56, 89, 99);
					loadPlane(r.tempData);
					//加载数据透视图
					loadArithmetic(r.sfhs, r.ddcs, r.bcfprs, r.jczrs, r.bcfpmyd, r.jczmyd, r.zhcj);
					//重新渲染#table_user
					table.reload('table_user', {
						url: url_alluser
					});
				},
				error:function(r){
					layer.close(load_index);
					layer.msg('服务器繁忙',{icon:5});
				}
			})
		})
	})
	//初始化座位按钮
	$('#btn_clearAll').click(function() {
		getautio4();//初始化音效
		layer.confirm('确定清空座位?', {
			title: '询问',
			icon: 3
		}, function() {
			var load_index = layer.load(2);
			$.ajax({
				url: url_clearSeat,
				type: 'get',
				success: function(r) {
					layer.close(load_index);
					window.location.reload();
				},
				error: function(r) {
					layer.close(load_index);
					layer.msg('服务器繁忙', {
						icon: 2
					});
				}
			})
			
		});
	})
});

//加载初始化座位图
function loadSeat() {
	var cabin1 = $('.cabin1');
	var cabin2 = $('.cabin2');
	var row = 1,
		i;
	for (i = 1; i <= (17 * 6); i += 6) {
		cabin1.append('<tr><td>' + (row < 10 ? '0' + row : row) + '</td><td><img id="seat' + i +
			'" src="img/seat.png" data-msg="' + (row + '排A座') + '" ></td><td><img id="seat' + (
				i + 1) + '" src="img/seat.png" data-msg="' + (row + '排B座') + '" ></td><td><img id="seat' + (i + 2) +
			'" src="img/seat.png" data-msg="' + (row + '排C座') + '" ></td><td></td><td><img id="seat' + (i + 3) +
			'" src="img/seat.png" data-msg="' + (row + '排J座') + '" ></td><td><img id="seat' +
			(i + 4) + '" src="img/seat.png" data-msg="' + (row + '排K座') + '" ></td><td><img id="seat' + (i + 5) +
			'" src="img/seat.png" data-msg="' + (row + '排L座') + '" ></td></li>');
		row++;
	}
	for (i = i; i <= (34 * 6); i += 6) {
		cabin2.append('<tr><td>' + (row < 10 ? '0' + row : row) + '</td><td><img id="seat' + i +
			'" src="img/seat.png" data-msg="' + (row + '排A座') + '" ></td><td><img id="seat' + (
				i + 1) + '" src="img/seat.png" data-msg="' + (row + '排B座') + '" ></td><td><img id="seat' + (i + 2) +
			'" src="img/seat.png" data-msg="' + (row + '排C座') + '" ></td><td></td><td><img id="seat' + (i + 3) +
			'" src="img/seat.png" data-msg="' + (row + '排J座') + '" ></td><td><img id="seat' +
			(i + 4) + '" src="img/seat.png" data-msg="' + (row + '排K座') + '" ></td><td><img id="seat' + (i + 5) +
			'" src="img/seat.png" data-msg="' + (row + '排L座') + '" ></td></li>');
		row++;
	}
	//挑出婴儿摇篮图片
	$('#seat1').attr('src','img/seat_er.png');
	$('#seat2').attr('src','img/seat_er.png');
	$('#seat3').attr('src','img/seat_er.png');
	$('#seat4').attr('src','img/seat_er.png');
	$('#seat5').attr('src','img/seat_er.png');
	$('#seat6').attr('src','img/seat_er.png');
	$('#seat43').attr('src','img/seat_er.png');
	$('#seat44').attr('src','img/seat_er.png');
	$('#seat45').attr('src','img/seat_er.png');
	$('#seat46').attr('src','img/seat_er.png');
	$('#seat47').attr('src','img/seat_er.png');
	$('#seat48').attr('src','img/seat_er.png');
	$('#tab_qian').click(function(){
		$('.left').css('background','url(img/plane_bg_qian.png)');
	})
	$('#tab_hou').click(function(){
		$('.left').css('background','url(img/plane_bg_hou.png)');
	})
}


//加载数据透视信息
function loadArithmetic(sfhs = 0, ddcs = 0, bcfprs = 0, jczrs = 0, bcfpmyd = 0, jczmyd = 0, zhcj = 0) {
	//算法耗时
	doSetInterval('#inf_sfhs', sfhs, 'ms');
	//迭代次数
	doSetInterval('#inf_ddcs', ddcs);
	//本次分配人数
	doSetInterval('#inf_bcfprs', bcfprs);
	//机舱总人数
	doSetInterval('#inf_jczrs', jczrs)
	//本次分配满意度
	var obj_bcfpmyd = $('#inf_bcfpmyd div');
	obj_bcfpmyd.width(0).css({
		"color": bcfpmyd <= 25 ? "red" : "white"
	}).text(bcfpmyd + '%').animate({
		"width": bcfpmyd + "%"
	}, 1500);
	//机舱总满意度
	var obj_jczmyd = $('#inf_jczmyd div');
	obj_jczmyd.width(0).css({
		"color": jczmyd <= 25 ? "red" : "white"
	}).text(jczmyd + '%').animate({
		"width": jczmyd + "%"
	}, 1500);
	//综合成绩
	doSetInterval('#inf_zhcj', zhcj);
}

//分配之后加载航班模型
function loadPlane(temps) {
	//让座位拥有tips功能
	layui.each(temps, function(index, el) {
		var seat = $('#seat' + el.seid);
		var satis = el.satis;
		if (satis >= 0 && satis < 25) {
			seat.attr('src', 'img/seat_red.png');
		} else if (satis >= 25 && satis < 50) {
			seat.attr('src', 'img/seat_orange.png');
		} else if (satis >= 50 && satis < 75) {
			seat.attr('src', 'img/seat_green.png');
		} else if (satis >= 75 && satis <= 100) {
			seat.attr('src', 'img/seat_shengreen.png');
		}
		seat.mouseover(function() {
			layer.tips('用户:' + el.uid + '<br />满意度:' + el.satis + '%<br />用户偏好:' + el.prefer, this, {
				time: 3000,
				tips: 1
			});
		})
		seat.mouseout(function() {
			layer.closeAll('tips');
		})
	})
}

//开辟一个定时器(数字从1变到target,参数1要innderHTML的对象,参数2:目标值,参数3:后缀小标签)
function doSetInterval(obj, target, tag) {
	var i = 0;
	var sudu = 8;
	if(target > 600)  sudu = 2;
	var index = setInterval(function() {
		if (i > target) {
			clearInterval(index);
		} else {
			$(obj).text(i + (tag == undefined ? '' : tag));
			i++;
		}
	}, sudu);
}

//仅仅渲染temp座位
function loadonlyTemp() {
	var load_index = layer.load(3);
	$.ajax({
		url: url_temp,
		type: 'post',
		success: function(r) {
			layer.close(load_index);
			loadPlane(r);
		},
		error: function(r) {
			layer.msg('服务器繁忙', {
				icon: 2
			});
			layer.close(load_index);
		}
	})
}

//勾勒出刚刚分配的座位
function stroke(temps){
	//先取消sibling其他兄弟元素的边框
	$('[id^="seat"]').parent().removeClass('border');
	//为刚刚分配的座位加边框
	layui.each(temps,function(index,el){
		var seat = $('#seat'+el.seid);
		seat.parent().addClass('border');
	})
}


//同步异步获得数据
function getAjaxData(url, data, async = false) {
	var res = null;
	$.ajax({
		url: url,
		type: 'get',
		async: async,
		data: data,
		success: function(r) {
			res = r;
		},
		error: function(r) {
			console.log(url, ':返回数据失败');
			res = null
		}
	})
	return res;
}

//播放音乐
function getautio1(){
		$('embed').remove();
		$('body').append('<embed src="music/oneday0.mp3" autostart="true" hidden="true" loop="false">');
}


function getautio2(){
	$('embed').remove();
	$('body').append('<embed src="music/oneday2.mp3" autostart="true" hidden="true" loop="false">');
}


function getautio3(){
	$('embed').remove();
	$('body').append('<embed src="music/oneday3.mp3" autostart="true" hidden="true" loop="false">');
}


function getautio4(){
	$('embed').remove();
	$('body').append('<embed src="music/oneday4.mp3" autostart="true" hidden="true" loop="false">');
}


function getautio5(){
	$('embed').remove();
	$('body').append('<embed src="music/oneday5.mp3" autostart="true" hidden="true" loop="false">');
}
